import React from 'react';
import { Button, Upload, message } from 'antd';
import PropTypes from 'prop-types';
import { onBeforeUpload, createParamsUrl } from './util';

/**
 * 文件导入组件  （本质依然是上传文件）
 */
function FileImport(props) {
  const { api, onFinish, text, ...res } = props;
  return (
    <Upload
      {...res}
      // todo Client Authorization 要么在url里面，要么在heasers里面，具体看后端要求
      action={createParamsUrl({}, undefined, api)}
      // headers={{
      //    Client: config.client,
      //   Authorization: localStorage.getItem('token'),
      // }}
      showUploadList={false}
      beforeUpload={onBeforeUpload}
      onChange={({ file, fileList }) => {
        if (file && file.response) {
          if (file.response.success) {
            message.success('上传成功');
            if (onFinish) {
              onFinish(file.response);
            }
          } else {
            message.error(file.response.message);
          }
          // 失败文件下载处理
          // todo 失败文件一般两种处理方式，1前端主动下载，2后端直接返回，本次是1
          // todo 该处需要配合新项目改动，具体看后端参数字段名称
          if (!file.response.success && file.response.models) {
            if (Array.isArray(file.response.models)) {
              file.response.models.forEach((i) => {
                const url = createParamsUrl(
                  { fileId: i.id, fileCode: i.code },
                  'download',
                );
                const createA = document.createElement('a');
                createA.download = i.originalName;
                createA.href = url;
                document.body.append(createA); // 不添加 firefix 无法触发点击
                createA.click();
                createA.remove();
              });
            }
          }
        }
      }}
    >
      <Button type="primary" style={{ marginRight: 8 }}>
        {text || '导入'}
      </Button>
    </Upload>
  );
}
/*
 * 核心参数
 * */
FileImport.propTypes = {
  api: PropTypes.string,
  onFinish: PropTypes.func,
  text: PropTypes.string, // 默认为 导入
};
export default FileImport;
